﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CustomerList.aspx.cs" Inherits="FastTravel.IntranetWeb.CustomerList" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title>Список клиентов</title>
	<ext:XScript ID="xScript" runat="server">
		<Script type="text/javascript">
			var clearFilter = function () {
				#{txtFilterFirstName}.reset();
				#{txtFilterLastName}.reset();
				#{txtFilterMiddleName}.reset();
				#{grdCustomer}.getStore().clearFilter();
			}
		</Script>
	</ext:XScript>
</head>
<body>
	<form id="formCustomerList" runat="server">
	<ext:ResourceManager ID="resourceManager" runat="server" Theme="Gray"/>

		<!-- data storage -->
		<ext:Store ID="storeMarritialStatus" runat="server">
			  <Reader>
				<ext:JsonReader IDProperty="Value">
					<Fields>
						<ext:RecordField Name="Text" />
						<ext:RecordField Name="Value" />
					</Fields>
				</ext:JsonReader>
			</Reader>           
		</ext:Store>

		<ext:GridPanel ID="grdCustomer" runat="server" Title="Клиенты" AutoHeight="true" StripeRows="true" AutoExpandColumn="LastName">
			<Store>
				<ext:Store ID="StoreCustomer" runat="server" OnRefreshData="StoreRefresh" RemoteSort="true" EnableTheming="true">
					<Proxy>
					   <ext:PageProxy />
					</Proxy>
					<Reader>
						<ext:JsonReader IDProperty="ID" TotalProperty="total">
							<Fields>
								<ext:RecordField Name="ID" Type="Int"/>
								<ext:RecordField Name="LastName" Type="String" SortDir="ASC"/>
								<ext:RecordField Name="FirstName" Type="String" />
								<ext:RecordField Name="MiddleName" Type="String" />
								<ext:RecordField Name="AddedDate" Type="Date" />
								<ext:RecordField Name="PhoneMobile" />
							</Fields>
						</ext:JsonReader>
					</Reader>
					<BaseParams>
						<ext:Parameter Name="start" Value="0" Mode="Raw" />
						<ext:Parameter Name="limit" Value="10" Mode="Raw" />
						<ext:Parameter Name="sort" Value="LastName" />
						<ext:Parameter Name="dir" Value="ASC" />
					</BaseParams>
					<SortInfo Field="LastName" Direction="ASC" />
				</ext:Store>
			</Store>
			<ColumnModel ID="columnCustomer" runat="server" EnableTheming="true">
				<Columns>
					<ext:Column ColumnID="ID" Header="№" Width="40" DataIndex="ID"/>
					<ext:Column Header="Фамилия" Width="230" DataIndex="LastName"/>
					<ext:Column Header="Имя" Width="230" DataIndex="FirstName" />
					<ext:Column Header="Отчество" Width="230" DataIndex="MiddleName" />
					<ext:DateColumn Header="Регистация" Width="80" DataIndex="AddedDate" />
					<ext:Column Header="Моб. тел." Width="90" DataIndex="PhoneMobile" >
						<Renderer Handler="return (value > 0) ? value: '-';" />
					</ext:Column>
					<ext:Column Width="28" DataIndex="ID" Sortable="false" MenuDisabled="true" Header="&nbsp;" Fixed="true">
						<Renderer Handler="return '';" />
					</ext:Column>
					<ext:Column Width="28" DataIndex="ID" Sortable="false" MenuDisabled="true" Header="&nbsp;" Fixed="true">
						<Renderer Handler="return '';" />
					</ext:Column>
				</Columns>
			</ColumnModel>
			<Listeners>
				<Command Handler="if (command == 'Delete') { #{DirectMethods}.DeleteRecord(record.data.id); }" />
			</Listeners>
			<View>
				<ext:GridView ID="grdFilter" runat="server" EnableTheming="true">
					<HeaderRows>
						<ext:HeaderRow>
							<Columns>
								<ext:HeaderColumn/>
								<ext:HeaderColumn>
									<Component>
										<ext:TextField runat="server" ID="txtFilterLastName" AllowBlank="true" SelectOnFocus="true">
											<DirectEvents>
												<SpecialKey Before="return e.getKey() == Ext.EventObject.ENTER;" OnEvent="BtnSearchCustomerClick"/>
											</DirectEvents>
										</ext:TextField>
									</Component>
								</ext:HeaderColumn>
								
								<ext:HeaderColumn>
									<Component>
										<ext:TextField runat="server" ID="txtFilterFirstName" AllowBlank="true" SelectOnFocus="true">
											<DirectEvents>
												<SpecialKey Before="return e.getKey() == Ext.EventObject.ENTER;" OnEvent="BtnSearchCustomerClick"/>
											</DirectEvents>
										</ext:TextField>
									</Component>
								</ext:HeaderColumn>
								
								<ext:HeaderColumn>
									<Component>
										<ext:TextField runat="server" ID="txtFilterMiddleName" AllowBlank="true" SelectOnFocus="true">
											<DirectEvents>
												<SpecialKey Before="return e.getKey() == Ext.EventObject.ENTER;" OnEvent="BtnSearchCustomerClick"/>
											</DirectEvents>
										</ext:TextField>
									</Component>
								</ext:HeaderColumn>

								<ext:HeaderColumn/>
								<ext:HeaderColumn/>

								<ext:HeaderColumn>
									<Component>
										<ext:Button runat="server" ID="btnFilterAdd" Icon="Find" >
											<ToolTips>
												<ext:ToolTip ID="tipFindData" runat="server" Html="Поиск" />
											</ToolTips>
											<DirectEvents>
												<Click OnEvent="BtnSearchCustomerClick" />
											</DirectEvents>
										</ext:Button>
									</Component>	
								</ext:HeaderColumn>

								<ext:HeaderColumn AutoWidthElement="false">
								<Component>
									<ext:Button ID="ClearFilterButton" runat="server" Icon="Cancel">
											<ToolTips>
												<ext:ToolTip ID="tipClearFilter" runat="server" Html="Очистить фильтр" />
											</ToolTips>
											 
											<Listeners>
												<Click Handler="clearFilter(null);" />
											</Listeners>                                            
										</ext:Button>
									</Component>
								</ext:HeaderColumn>

							</Columns>
						</ext:HeaderRow>
					</HeaderRows>
				</ext:GridView>
			</View>	
			<BottomBar>
				<ext:PagingToolbar ID="toolbarBottomPaging" runat="server" BeforePageText="Страница" AfterPageText="из" PageSize="10" DisplayInfo="true" DisplayMsg="Клиенты {0} - {1} из {2}      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" EmptyMsg="Нет клиентов"  LabelAlign="Left" EnableTheming="true">
					<Items>
						<ext:Label runat="server" Text="Размер страницы:" />
						<ext:ToolbarSpacer runat="server" Width="10" EnableTheming="true"/>
						<ext:ComboBox runat="server" Width="50" EnableTheming="true">
							<Items>
								<ext:ListItem Text="10" />
								<ext:ListItem Text="15" />
								<ext:ListItem Text="20" />
								<ext:ListItem Text="30" />
								<ext:ListItem Text="50" />
							</Items>
							<SelectedItem Value="10" />
							<Listeners>
								<Select Handler="#{toolbarBottomPaging}.pageSize = parseInt(this.getValue()); #{toolbarBottomPaging}.doLoad();" />
							</Listeners>
						</ext:ComboBox>
					</Items>
				</ext:PagingToolbar>
			</BottomBar>
			<SelectionModel>
						<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" EnableTheming="true">
							<DirectEvents>
								<RowSelect OnEvent="RowSelected" Buffer="100">
									<EventMask ShowMask="true" Target="CustomTarget" CustomTarget="#{pnlDetail}" />
									<ExtraParams>
										<%-- or can use params[2].id as value --%>
										<ext:Parameter Name="ID" Value="#{grdCustomer}.getSelectionModel().hasSelection() ? #{grdCustomer}.getSelectionModel().getSelected().id : -1" Mode="Raw" />
									</ExtraParams>
								</RowSelect>
							</DirectEvents>
						</ext:RowSelectionModel>
			</SelectionModel>
			
			<LoadMask ShowMask="true" Msg="Загрузка данных о клиентах..."/>

		</ext:GridPanel>
			
		<ext:Panel 
			ID="pnlDetailInfo"
			runat="server" 
			LabelWidth="75"
			Layout="Fit"
			Title="Детальная информация" 
			Frame="true"
			Icon="VcardEdit"
			AutoWidth="true"
			ButtonAlign="Center"
			Padding="2" 
			EnableTheming="true">
			
			<TopBar>
				<ext:Toolbar ID="toolbarTop" runat="server" Height="30" EnableTheming="true">
					<Items>
						<ext:ToolbarSpacer runat="server" Width="10" EnableTheming="true"/>
						<ext:Button runat="server" ID="btnSaveDetail" Text="Сохранить" Icon="Disk" >
							<DirectEvents>
								<Click OnEvent="BtnSaveDetailClick">
									<EventMask ShowMask="true" MinDelay="250" Msg="Сохранение изменений..."/>
								</Click>
							</DirectEvents>	
						</ext:Button>
						
						<ext:ToolbarSpacer runat="server" Width="20"/>
						<ext:ToolbarSeparator/>
						<ext:ToolbarSpacer runat="server" Width="20"/>

						<ext:Button runat="server" ID="btnReportDetail" Text="Отчет для печати" Icon="PageWhiteAcrobat" >
							<DirectEvents>
								<Click OnEvent="BtnReportDetailClick">
								</Click>
							</DirectEvents>	
						</ext:Button>

						<ext:ToolbarSpacer runat="server" Width="20"/>
						<ext:ToolbarSeparator/>
						<ext:ToolbarSpacer runat="server" Width="20"/>

						<ext:Button runat="server" ID="btnDeleteDetail" Text="Удалить" Icon="Cross" >
							 <DirectEvents>
									<Click OnEvent="BtnDeleteRecordClick" >
										<Confirmation Title="Удаление клиента" Cancel="Нет" ConfirmRequest="true"  Message="Удалить этого клиента?" />
									</Click>
							</DirectEvents>
						</ext:Button>

					</Items>
				</ext:Toolbar>
			</TopBar>
		

			<Items>
			
			  <ext:Container ID="containerDetail" runat="server" Layout="Column" Height="360" EnableTheming="true">
					<Items>
						
						<ext:Container ID="containerInformation" runat="server" Layout="Form" ColumnWidth=".5">
						<Items>

						<ext:FieldSet runat="server" ID="fsInformation" Border="false">
							<Items>
								<ext:FieldSet runat="server" ID="fsPersonalInfo" Title="Ф.И.О." Border="true">
									<Items>
									   <ext:TextField runat="server" ID="txtDetailLastName" Text="" FieldLabel="Фамилия"    Width="330" />
									   <ext:TextField runat="server" ID="txtDetailFirstName" Text="" FieldLabel="Имя"  Width="330" />
									   <ext:TextField runat="server" ID="txtDetailMiddleName" Text="" FieldLabel="Отчество" Width="330"/>
									   <ext:DateField runat="server" ID="dateDetailBirth" FieldLabel="Дата рождения" Width="330"/>
									</Items>
								</ext:FieldSet>
								<ext:FieldSet runat="server" ID="fsContactInfo" Title="Контакты" Border="true">
									<Items>
										<ext:TextField runat="server" ID="txtDetailAddress1" Text="" FieldLabel="Адрес1" Width="330"/>
										<ext:TextField runat="server" ID="txtDetailAddress2" Text="" FieldLabel="Адрес2" Width="330"/>
										<ext:TextField runat="server" ID="txtDetailEmail" Text="" FieldLabel="Email" Width="330" AllowBlank="true"/>
										<ext:NumberField runat="server" ID="txtDetailPhoneMob" Text="0" FieldLabel="Мобильный тел." Width="330"
											MinValue="0" MaxValue="99999999999" MinLength="1" MaxLength="11" AllowBlank="true" 
											NanText="{value} - это неверный номер" 
											MaxText="Максимальное значение для этого поля быть {maxValue}" 
											MinText="Минимальное значение для этого поля {minValue}" />
										<ext:NumberField runat="server" ID="txtDetailPhoneHom" Text="0" FieldLabel="Домашний тел." Width="330" 
											MinValue="0" MaxValue="99999999999" MinLength="1" MaxLength="11" AllowBlank="true" 
											NanText="{value} - это неверный номер" 
											MaxText="Максимальное значение для этого поля быть {maxValue}" 
											MinText="Минимальное значение для этого поля {minValue}" />
										<ext:NumberField runat="server" ID="txtDetailPhoneWrk" Text="0" FieldLabel="Рабочий тел." Width="330"
											MinValue="0" MaxValue="99999999999" MinLength="1" MaxLength="11" AllowBlank="true"
											NanText="{value} - это неверный номер" 
											MaxText="Максимальное значение для этого поля быть {maxValue}" 
											MinText="Минимальное значение для этого поля {minValue}" />
									</Items>
								</ext:FieldSet>
							</Items>
						</ext:FieldSet>
						
						</Items>
						</ext:Container>
						
						<ext:Container ID="containerPasport" runat="server" Layout="Form" ColumnWidth=".5">
							<Items>
								<ext:FieldSet runat="server" ID="fsPassport" Border="false">
									<Items>
										<ext:FieldSet runat="server" ID="fsPassportData" Title="Паспортные данные" Border="true">
											<Items>
												<ext:TextField runat="server" ID="txtDetailPassportNumber" Text="" FieldLabel="Номер паспорта"  Width="330"/>
												<ext:TextField runat="server" ID="txtDetailAuthority" Text="" FieldLabel="Кем выдан" Width="330"/>
									
												<ext:FieldSet runat="server" ID="fsDateRange" Title="Дата действия" Width="330">
													<items>
														<ext:DateField ID="dateFieldFrom" runat="server" Vtype="daterange" FieldLabel="Дата выдачи" Width="300" >
															<CustomConfig>
																<ext:ConfigItem Name="endDateField" Value="#{dateFieldTo}" Mode="Value" />
															</CustomConfig>                        
														</ext:DateField>
														<ext:DateField ID="dateFieldTo" runat="server" Vtype="daterange" FieldLabel="До" Width="300" >    
															<CustomConfig>
																<ext:ConfigItem Name="startDateField" Value="#{dateFieldFrom}" Mode="Value" />
															</CustomConfig>                                 
														</ext:DateField>
													</items>
												</ext:FieldSet>
											</Items>
										</ext:FieldSet>
										<ext:FieldSet runat="server" ID="fsAdditionalInfo" Title="Дополнительно" Border="true">
											<Items>
												<ext:TextField ID="txtDetailJobPlace" runat="server" FieldLabel="Место работы" Width="330" />
												<ext:TextField ID="txtDetailProfession" runat="server" FieldLabel="Профессия" Width="330" />
												<ext:ComboBox ID="comboMarritialStatus" runat="server" FieldLabel="Семейное положение" SelectedIndex="0" StoreID="storeMarritialStatus" DisplayField="Text" ValueField="Value" Mode="Local" Width="330" />
											</Items>
										</ext:FieldSet>
									</Items>
								</ext:FieldSet>
							</Items>
						</ext:Container>
					</Items>
				</ext:Container>
		</Items>
		</ext:Panel>
	</form>
</body>
</html>
